<html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- jQuery -->
    <script type="text/javascript" src="../js/jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="../js/jquery-3.3.1.js"></script>

    <!-- Bootstrap -->
    <link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
    <script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script src="../js/getParameter.js"></script>

    <style type="text/css">

        #title {
            background-color: cornflowerblue;
        }

        .row-margin-top {
            margin-top: 10px;
        }

        html {
            overflow-x: hidden;
            overflow-y: auto;
        }

        .list {
            height: 290px;
            width: 250px;
            margin: 10px;
            padding: 20px;
            float: left;
            border: 1px #e3e3e3 solid;
        }

        .img_div {
            height: 250px;
            text-align: center;
        }

        .img {
            height: 230px;
            width: 230px;
        }

        .info {
            text-align: center;
        }

        #footer {
            text-align: center;
            font-size: 20px;
            position: relative;
            bottom: 10px;
        }

        #myInfo {
            font-family: 微软雅黑;
            font-size: large;
            color: blue;
        }

        .carousel-inner > .item > img {
            width: 100%; /* Or try to use important */
            height: 400px;
        }

    </style>

</head>
<body>


<!--页面主体-->
<div class="container-fluid">
    <div class="row " id="title">

        <div class="col-md-1 row-margin-top" id="play">
            <button id="back" class="btn btn-info btn-lg active"><span class="glyphicon  glyphicon-arrow-left"
                                                                       aria-hidden="true"></span>&nbsp;返回
            </button>

        </div>

        <div class="col-md-4 col-md-offset-3" id="ttms">
            <h1>欢 迎 光 临 T T M S 影 院 </h1>
        </div>

        <div class="col-md-1 col-md-offset-2 row-margin-top">
            <a href="myInfo.html">
                <button id="myInfo" class="btn btn-link btn-lg "><span class="glyphicon glyphicon-user"
                                                                       aria-hidden="true"></span>&nbsp;
                </button>
            </a>
        </div>

    </div>

    <div class="row row-margin-top">
        <div class="col-md-12">
            <div class="col-md-2">
                <input type="text" class="form-control" id="select_input" placeholder="请  输  入  电  影  名  称"
                       name="playName">
            </div>
            <div class="col-md-1">
                <button id="select_button" class="btn btn-success btn-sm"><span class="glyphicon glyphicon-search"
                                                                                aria-hidden="true"></span>搜索
                </button>
            </div>

            <div class="col-md-1 col-md-offset-10">
                <a href="refundView.html">
                    <button class="btn btn-link btn-lg "><span class="glyphicon glyphicon-list-alt"
                                                               aria-hidden="true"></span>&nbsp;我的电影票
                    </button>
                </a>
            </div>

        </div>
    </div>

    <div class="row row-margin-top">
        <div class="col-md-3 col-md-offset-5">
            <h1>搜索结果</h1>
        </div>
    </div>

    <div class="row">
        <div class="col-md-8 col-md-offset-2" id="main">
            <!--<div class="list">-->
                <!--<div class="img_div">-->
                    <!--<a href="/cinema/pages/scheduleView.html?playName=釜山行">-->
                        <!--<img src="../images/fushanxing.jpg" class="img img-rounded">-->
                    <!--</a>-->
                    <!--<div class="info">-->
                        <!--<span class="sp1">釜山行</span>-->
                    <!--</div>-->
                <!--</div>-->
            <!--</div>-->
        </div>
    </div>


    <div class="row row-margin-top">
        <!-- 分页条信息 -->
        <div id="page_nav" class="col-md-4 col-md-offset-5">
            </ul>
            <div class="page_num_inf">共
                <span id="totalPage_span">12</span>页<span id="totalCount_span">132</span>条
            </div>
            <nav>
                <div class="pageNum">
                    <ul id="routePage_ul" class="pagination">
                        <!--<li><a href="#">首页</a></li>-->
                        <!--<li class="threeword"><a href="#">上一页</a></li>-->
                        <!--<li><a href="#">1</a></li>-->
                        <!--<li><a href="#">2</a></li>-->
                        <!--<li><a href="#">3</a></li>-->
                        <!--<li class="threeword"><a href="#">下一页</a></li>-->
                        <!--<li class="threeword"><a href="#">末页</a></li>-->
                    </ul>
                </div>
            </nav>
        </div>
    </div>

    <div class="row row-margin-top">
        <!--分页信息  -->
        <div id="page_info" class="col-md-4 col-md-offset-5">

        </div>
    </div>

    <!--页脚-->
    <div class="row">
        <div id="footer" class="col-md-12">
            <hr style="height:1px;border:none;border-top:1px solid #555555;"/>
            <span>CopyRight@2020</span>
        </div>
    </div>
</div>
</body>

</html>
<script>
    $(function () {
        var uri = location.search;
        //解决乱码
        var searchOne = decodeURIComponent(uri).split("=")[1];
        searchPlay(searchOne,1,6)

        //点击返回  返回首页
        $("#back").click(function () {
            location.href='/cinema/pages/playView.html'
        })

    })

    //显示搜索出来的结果
    function searchPlay(searchOne,currentPage,rows) {
        $.ajax({
            type: "post",
            url: "../play/searchMovie",
            data:{"searchOne":searchOne,"currentPage":currentPage,"rows":rows},
            success: function (data) {
                //分页
                $("#totalPage_span").html(data.totalPage)
                $("#totalCount_span").html(data.totalCount)

                //判断上一页
                var prePage = currentPage - 1;
                if (prePage < 1) {
                    prePage = 1
                }

                //判断下一页
                var nextPage = currentPage + 1;
                if (nextPage > data.totalPage) {
                    nextPage = data.totalPage
                }

                //第几页的拼接
                var routePage_ul = ''
                routePage_ul += ' <li><a href="javascript:findPlay(1,' + rows + ')">首页</a></li>\n' +
                    '                    <li class="threeword"><a href="javascript:findPlay(' + prePage + ',' + rows + ')">上一页</a></li>'
                for (var i = 1; i <= data.totalPage; i++) {
                    // routePage_ul += '<li><a href="javascript:findPlay()">' + i + '</a></li>\n'

                    if (currentPage == i) {
                        routePage_ul += '<li class="curPage"  onclick="findPlay('+searchOne+',' +  i + ',' + rows + ')"><a href="javascript:findPlay('+searchOne+','  + i + ',' + rows + ')">' + i + '</a></li>';
                    } else {
                        routePage_ul += '<li ><a href="javascript:findPlay('+searchOne+',' +  i + ',' + rows + ')">' + i + '</a></li>';

                    }



                }
                routePage_ul += ' <li class="threeword"><a href="javascript:findPlay('+searchOne+',' + nextPage + ',' + rows + ')">下一页</a></li>\n' +
                    '                    <li class="threeword"><a href="javascript:findPlay('+searchOne+',' + data.totalPage + ',' + rows + ')">末页</a></li>'

                $("#routePage_ul").html(routePage_ul)


                //如果返回空说明没有找到
                if (data == null) {
                   alert("未找到")
                    return
                }
                //查询到
                var main=''
                for (var i = 0; i <data.list.length ; i++) {
                    main += ' <div class="list">\n' +
                        '            <div class="img_div">\n' +
                        '                <a href="/cinema/pages/scheduleView.html?playName=' + data.list[i].playName + '">\n' +
                        '                    <img src="../images/' + data.list[i].playImage + '.jpg" class="img img-rounded">\n' +
                        '                </a>\n' +
                        '                <div class="info">\n' +
                        '                    <span class="sp1">' + data.list[i].playName + '</span>\n' +
                        '                </div>\n' +
                        '            </div>\n' +
                        '        </div>'
                }
                $("#main").html(main)
            },
            dataType: "json"
        })
    }
</script>